<template>
  <d2-container :filename="filename">
    <el-form label-width="80px" :inline="true">
      <el-form-item>
        <el-button type="primary" @click="search()" icon="el-icon-search"
          >查询</el-button
        >
        <el-button type="primary" @click="add()" icon="el-icon-plus"
          >新增</el-button
        >
      </el-form-item>
    </el-form>
    <el-form label-width="80px" ref="searchForm" :inline="true">
      <el-form-item label="关键词" prop="keyword">
        <el-input v-model="searchData.keyword" clearable />
      </el-form-item>
      <el-form-item label="状态" prop="isActive">
        <el-select v-model="searchData.isActive" clearable placeholder="请选择">
          <el-option
            v-for="item in options"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          >
          </el-option>
        </el-select>
      </el-form-item>
    </el-form>
    <el-row>
      <el-table
        :data="tableData"
        stripe
        style="width: 100%"
        element-loading-text="加载中"
        v-loading="tabloading"
        border=""
      >
        <el-table-column type="index"></el-table-column>
        <el-table-column label="操作" width="150">
          <template slot-scope="scope">
            <div>
              <el-tooltip
                class="item"
                effect="dark"
                content="删除"
                placement="top-start"
              >
                <el-button
                  type="danger"
                  size="mini"
                  icon="el-icon-delete"
                  @click="deleteRow(scope.row)"
                  circle
                ></el-button>
              </el-tooltip>
              <el-tooltip
                class="item"
                effect="dark"
                content="修改"
                placement="top-start"
              >
                <el-button
                  type="primary"
                  icon="el-icon-edit"
                  @click="updateRow(scope.row)"
                  size="mini"
                  circle
                ></el-button>
              </el-tooltip>
            </div>
          </template>
        </el-table-column>
        <el-table-column label="租户名称" prop="name"> </el-table-column>
        <el-table-column label="租户代码" prop="tenancyName"> </el-table-column>
        <el-table-column label="状态" prop="isActive">
          <template slot-scope="scope">
            {{ scope.row.isActive === true ? "激活" : "锁定" }}
          </template>
        </el-table-column>
      </el-table>
    </el-row>
    <el-row>
      <el-pagination
        background
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :page-sizes="[20, 50, 100, 500]"
        :page-size="searchData.maxResultCount"
        layout="total, sizes, prev, pager, next, jumper"
        :total="searchData.total"
      >
      </el-pagination>
    </el-row>
    <createModel ref="createModel" @fromvisible="pageReload"></createModel>
  </d2-container>
</template>

<script>
import { GetAll, Delete } from '@api/systemManage/tenantManage'
import createModel from '@/pages/systemManage/tenantManage/createModel'
export default {
  name: 'tenantManage',
  inject: ['reload'],
  components: { createModel },
  data () {
    return {
      filename: __filename,
      tabloading: false,
      tableData: [],
      searchData: {
        skipCount: 0,
        maxResultCount: 20,
        total: 0,
        keyword: '',
        isActive: ''
      },
      options: [
        {
          value: false,
          label: '锁定'
        }, {
          value: true,
          label: '激活'
        }
      ]
    }
  },
  created () {
    this.search()
  },
  methods: {
    search () {
      this.searchData.skipCount = 0
      this.getTenantAll()
    },
    pageReload () {
      this.search()
    },
    getTenantAll () {
      this.tabloading = true
      GetAll(this.searchData).then(res => {
        if (res.success) {
          this.tabloading = false
          this.tableData = res.result.items
          this.searchData.total = res.result.totalCount
        }
      })
    },
    handleSizeChange (val) {
      this.searchData.maxResultCount = val
      this.search()
    },
    handleCurrentChange (val) {
      this.searchData.skipCount = val - 1
      this.search()
    },
    updateRow (row) {
      this.$refs.createModel.show(row.id, '修改')
    },
    add () {
      this.$refs.createModel.show('', '新增')
    },
    deleteRow (row) {
      this.$confirm('是否删除租户[' + row.name + ']?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        Delete(row.id).then(res => {
          if (res.success) {
            this.$notify({
              title: '提示',
              message: '删除成功',
              type: 'success'

            })
            this.search()
          }
        })
      })
    }
  }

}
</script>
